<template>
    <div>

        <el-form @submit.native.prevent ref="ruleForm" :model="formFileds">
            <el-row :gutter="24">
                <el-col :span="12">
                    <el-form-item>
                        <el-input v-model="formFileds.text" prefix-icon="el-icon-search" placeholder="搜索企业名称"
                            @keyup.enter.native="search()">
                        </el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="2">
                    <el-form-item>
                        <el-button type="primary" @click="search()">查询
                        </el-button>
                    </el-form-item>
                </el-col>

                <el-col :span="2">
                    <el-form-item>
                        <el-button type="primary" @click="deleteSelection">批量删除
                        </el-button>
                    </el-form-item>
                </el-col>

            </el-row>
        </el-form>

        <el-table ref="list" :data="tableData" style="width: 100%; margin-bottom: 5px;" border row-key="id"
            :tree-props="{ children: 'children', hasChildren: 'hasChildren' }" highlight-current-row
            :default-sort="{ prop: 'date', order: 'descending' }" @select-all="handleCheckedAllAndCheckedNone"
            @select="handleCheckedAllAndCheckedNone" @selection-change="handleSelectionChange"
            :header-cell-style="{ textAlign: 'center' }" :cell-style="{ textAlign: 'center' }">
            <el-table-column type="selection" fixed width="50px">
            </el-table-column>
            <el-table-column prop="id" label="企业ID" width="120px" fixed>
            </el-table-column>
            <el-table-column prop="companyName" label="企业名称" width="200px">
            </el-table-column>
            <el-table-column prop="abbreviated" label="企业简称" width="120px">
            </el-table-column>
            <el-table-column prop="contact" label="单位联系人" width="100px">
            </el-table-column>
            <el-table-column prop="phone" label="办公电话" width="150px">
            </el-table-column>
            <el-table-column prop="email" label="电子邮箱" width="150px">
            </el-table-column>
            <el-table-column prop="address" label="办公地址" width="200px">
            </el-table-column>
            <el-table-column prop="corporate" label="法人" width="100px">
            </el-table-column>
            <el-table-column prop="creditCode" label="信用代码" width="200px">
            </el-table-column>
            <el-table-column prop="logo" label="logo" width="100px">
                <template slot-scope="scope">
                    <img :src="scope.row.logo" alt="logo" style="width:100%;height:auto">
                </template>
            </el-table-column>
            <el-table-column prop="officialSeal" label="公章" width="100px">
                <template slot-scope="scope">
                    <img :src="scope.row.officialSeal" alt="officialSeal" style="width:100%;height:auto">
                </template>
            </el-table-column>
            <el-table-column prop="wechat" label="微信号" width="120px">
            </el-table-column>
            <el-table-column prop="officialAccount" label="公众号" width="100px">
                <template slot-scope="scope">
                    <img :src="scope.row.officialAccount" alt="officialAccount" style="width:100%;height:auto">
                </template>
            </el-table-column>
            <el-table-column prop="createTime" label="创建时间" width="180px">
            </el-table-column>
            <el-table-column label="操作" width="250px" fixed="right">
                <template slot-scope="scope">
                    <el-dropdown @command="handCommand">
                        <el-button type="primary" size="mini">授权</el-button>
                        <el-dropdown-menu slot="dropdown">
                            <!-- <el-dropdown-item :command="{ qyid: scope.row.id, str: 'jdcjdpg', fun: scope.row.jdcjdpg }">机动车鉴定评估<span
                                            v-if="scope.row.jdcjdpg">（已授权）</span></el-dropdown-item> -->
                            <el-dropdown-item :command="{ qyid: scope.row.id, str: 'bfjd', fun: scope.row.bfjd }">报废鉴定<span
                                    v-if="scope.row.bfjd">（已授权）</span></el-dropdown-item>
                            <el-dropdown-item :command="{ qyid: scope.row.id, str: 'qsjd', fun: scope.row.qsjd }">全损鉴定<span
                                    v-if="scope.row.qsjd">（已授权）</span></el-dropdown-item>
                            <el-dropdown-item :command="{ qyid: scope.row.id, str: 'tyss', fun: scope.row.tyss }">停运受损<span
                                    v-if="scope.row.tyss">（已授权）</span></el-dropdown-item>
                            <el-dropdown-item :command="{ qyid: scope.row.id, str: 'jszkjd', fun: scope.row.jszkjd }">技术状况鉴定<span
                                    v-if="scope.row.jszkjd">（已授权）</span></el-dropdown-item>
                            <el-dropdown-item :command="{ qyid: scope.row.id, str: 'sgcsspg', fun: scope.row.sgcsspg }">事故车损失评估<span
                                    v-if="scope.row.sgcsspg">（已授权）</span></el-dropdown-item>
                            <el-dropdown-item :command="{ qyid: scope.row.id, str: 'jgjz', fun: scope.row.jgjz }">价格鉴证<span
                                    v-if="scope.row.jgjz">（已授权）</span></el-dropdown-item>
                            <el-dropdown-item :command="{ qyid: scope.row.id, str: 'bxgg', fun: scope.row.bxgg }">保险公估<span
                                    v-if="scope.row.bxgg">（已授权）</span></el-dropdown-item>
                            <el-dropdown-item :command="{ qyid: scope.row.id, str: 'zcpg', fun: scope.row.zcpg }">资产评估<span
                                    v-if="scope.row.zcpg">（已授权）</span></el-dropdown-item>
                        </el-dropdown-menu>
                    </el-dropdown>
                    <el-button type="primary" size="mini" @click="rowEdit(scope.row)"
                        style="margin-left: 10px;">编辑</el-button>
                    <el-button type="danger" size="mini" @click="rowDel(scope.row.id)">删除</el-button>
                </template>
            </el-table-column>
        </el-table>

        <!--分页-->
        <el-pagination :page-sizes="[10, 20, 30, 40, 100]" :page-size="10" :total="100"
            layout="total, sizes, prev, pager, next, jumper">
        </el-pagination>

        <!-- 增加-弹出层 -->
        <EnterpriseEdit ref="enterpriseEditRef" v-if="isShowEditDialog" :isShowEditDialog="isShowEditDialog"
            :record="formFileds" @dialogClose="dialogClose" @Ok="getList()"></EnterpriseEdit>
    </div>
</template>
      
<script>
import EnterpriseEdit from './enterpriseEdit.vue';
import { selectAll, del, selectByName, open, close } from '@/api/systemManage/enterpriseMaage'

export default {
    name: "enterpriseManage",
    components: {
        EnterpriseEdit
    },
    data () {
        return {
            formFileds: {
            },
            multipleSelection: null,
            tableData: [],
            isShowEditDialog: false
        }
    },
    methods: {
        search () {
            let text = this.formFileds.text
            selectByName('companyName=' + text).then((res) => {
                this.tableData = res.data
            })
        },

        handCommand (command) {
            if (command.fun) {
                close('qyid=' + command.qyid + '&function=' + command.str).then((res) => {
                    if (res) {
                        this.$message.success('授权已取消')
                        this.getList()
                    }
                })
            } else {
                open('qyid=' + command.qyid + '&function=' + command.str).then((res) => {
                    if (res)
                        this.$message.success('授权成功')
                    this.getList()
                })
            }
        },
        handleCheckedAllAndCheckedNone (selection) {

            // 当前选中仅一行时操作-（当前表格行高亮）
            1 != selection.length && this.$refs.list.setCurrentRow();
        },

        handleSelectionChange (val) {
            this.multipleSelection = val;
        },

        dialogClose () {
            this.isShowEditDialog = false;
        },

        rowEdit (row) {
            this.formFileds = row;
            this.isShowEditDialog = true;
        },

        deleteSelection () {

            if (!this.multipleSelection) {
                this.$message.warning('请至少选择一条数据进行删除！')
                return
            } else {

                this.$confirm('数据将会永久删除，是否继续？', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning',
                    center: true
                }).then(() => {

                    // console.log(this.multipleSelection)

                    // delete (array).then(res => {//接口
                    //     console.log(res);
                    //     this.search();//删除完成后初始化查询列表
                    // })

                })
            }
        },
        rowDel (Id) {
            this.$confirm('确定要删除当前行吗？', '删除', {
                comfirmButtonText: '确定',
                cancelButtonText: '取消'
            }).then(() => {
                let id = Id;
                del('id=' + id).then((res) => {
                    if (res) {
                        this.$message.success('删除成功！');
                        this.getList();
                    }
                })
            });
        },

        getList () {
            selectAll().then((res) => {
                this.tableData = res.data
            })
        },

    },
    mounted () {
        this.getList();
    }
}
</script>
      
<style scoped lang="less">
.el-form {
    padding: 0 10px;
}

.el-date-editor {
    width: 100% !important;
}
</style>
      